<template>
<div class="page" data-name="sobill-query">
	<div class="navbar">
		<div class="navbar-inner sliding">
			<div class="left">
				<a href="#" class="link back"> <i class="icon icon-back"></i> <span
					class="ios-only">返回</span>
				</a>
			</div>
			<div class="title">销售订单查询</div>
		</div>
	</div>
	<div class="page-content">
		<form>
			<div class="list inline-labels no-hairlines">
				<ul>
					<li><div class="item-content item-input">
							<div class="item-inner">
								<div class="item-title item-label">订单状态</div>
								<div class="item-input-wrap">
									<select name="billStatus" id="editBillStatus">
										<option value="-1">全部</option>
										<option value="0" selected>待审核</option>
										<option value="1000">已审核</option>
										<option value="2000">部分出库</option>
										<option value="3000">全部出库</option>
									</select>
								</div>
							</div>
						</div></li>
					<li><div class="item-content item-input">
							<div class="item-inner">
								<div class="item-title item-label">客户</div>
								<div class="item-input-wrap">
									<a class="item-link item-content" href="#" id="popupCustomer">
										<input type="hidden">
										<div class="item-inner">
											<input type="hidden" name="customerId" id="editCustomerId">
											<div class="item-title" id="editCustomerName"></div>
											<div class="item-after"></div>
										</div>
									</a>
								</div>
							</div>
						</div></li>
					<li><div class="item-content item-input">
							<div class="item-inner">
								<div class="item-title item-label">单号</div>
								<div class="item-input-wrap">
									<input type="text" name="billNumber" id="editRef"><span
										class="input-clear-button"></span>
								</div>
							</div>
						</div></li>
					<li>交货日期</li>
					<li><div class="item-content item-input">
							<div class="item-inner">
								<div class="item-title item-label">起</div>
								<div class="item-input-wrap">
									<input type="text" name="dealDTFrom" id="editDealDTFrom"
										readonly="readonly"><span class="input-clear-button"></span>
								</div>
							</div>
						</div></li>
					<li><div class="item-content item-input">
							<div class="item-inner">
								<div class="item-title item-label">止</div>
								<div class="item-input-wrap">
									<input type="text" name="dealDTTo" id="editDealDTTo"
										readonly="readonly"><span class="input-clear-button"></span>
								</div>
							</div>
						</div></li>
					<li><div class="item-content item-input">
							<div class="item-inner">
								<div class="item-title item-label">收款方式</div>
								<div class="item-input-wrap">
									<select name="receivingType" id="editReceivingType">
										<option value="-1" selected>全部</option>
										<option value="0">记应收账款</option>
										<option value="1">现金收款</option>
									</select>
								</div>
							</div>
						</div></li>
				</ul>
			</div>
		</form>

		<div class="block">
			<div class="row">
				<div class="col-50">
					<button class="col button button-fill" id="buttonClear" href="#">重置查询条件</button>
				</div>
				<div class="col-50">
					<button class="col button button-fill" id="buttonQuery" href="#">查询</button>
				</div>
			</div>
		</div>
	</div>
</div>
</template>

<script>
	return {
		methods : {},
		data : function() {
			return {};
		},
		on : {
			pageInit : function(e, page) {
				var app = page.app;
				app.calendar.create({
					inputEl : "#editDealDTFrom"
				})

				app.calendar.create({
					inputEl : "#editDealDTTo"
				})

				var $$ = Dom7;

				app.autocomplete.create({
					openIn : 'page',
					openerEl : '#popupCustomer',
					closeOnSelect : true,
					valueProperty : 'id',
					textProperty : 'name',
					preloader : true,
					source : function(query, render) {
						var me = this;
						var results = [];
						if (query.length === 0) {
							render(results);
							return;
						}

						me.preloaderShow();

						var url = app.data.PSI.baseURI
								+ "H5/Sale/queryCustomerData";

						app.request({
							url : url,
							method : 'POST',
							dataType : 'json',
							data : {
								query : query,
							},
							success : function(data) {
								me.preloaderHide();
								render(data);
							}
						});
					},
					on : {
						change : function(value) {
							var v = value[0];
							$$("#editCustomerId").val(v.id);
							$$("#editCustomerName").text(v.name);
						}
					}
				});

				$$("#buttonQuery").on("click", function() {
					page.router.navigate("/sobillList/", {
						context : {
							billStatus : $$("#editBillStatus").val(),
							ref : $$("#editRef").val(),
							receivingType : $$("#editReceivingType").val(),
							fromDT : $$("#editDealDTFrom").val(),
							toDT : $$("#editDealDTTo").val(),
							customerId : $$("#editCustomerId").val(),
							currentPage: 1
						}
					});
				});

				$$("#buttonClear").on("click", function() {
					$$("#editBillStatus").val(0);
					$$("#editRef").val("");
					$$("#editReceivingType").val(-1);
					$$("#editDealDTFrom").val("");
					$$("#editDealDTTo").val("");
					$$("#editCustomerId").val("");
					$$("#editCustomerName").text("");
				});
			}
		}
	};
</script>

